<template>
    <el-form>

        <el-form-item label="姓名" prop="name">
            <el-input v-model="name"></el-input>
        </el-form-item>

        <el-form-item>
            <el-upload ref="upfile"
                       style="display: inline"
                       :auto-upload="false"
                       :on-change="handleChange"
                       :file-list="fileList"
                       action="#">
                <el-button  type="success">选择文件</el-button>
            </el-upload>
        </el-form-item>

        <el-form-item>
            <el-button  type="success" @click="getImage">点击上传</el-button>
        </el-form-item>
<!--        <img :src="$hostURL+scope.row.photo" alt="" style="width: 150px;height: 150px">-->
        <img src='http://localhost:8080/images/img586de78b-d087-41fd-a776-9ec0a49e049d.jpg'  style="width: 150px;height: 150px"/>
    </el-form>

</template>
<script>
    import {setImg} from "../../api/api";
    import {Message} from "element-ui";
    import {getImg} from "../../api/api";

    export default {
        name:'UploadUi',
        data(){
            return{
                name:'b02e236d-1b57-4b56-8984-7568695ab107.jpg',
                fileList:[],
                imageUrl: ''
            }
        },
        methods:{
            //通过onchanne触发方法获得文件列表
            handleChange(file, fileList) {
                this.fileList = fileList;
                console.log(fileList)

                    //this.imageUrl = URL.createObjectURL(file);
            },
            getImage(){
                getImg(this.name).then(res=>{
                    console.log(res.data)
                    if (res.data.status === 200) {
                        Message.success("下载成功")
                        console.log("下载成功");
                    }
                })
            },
            upload(){

                let fd = new FormData();
                fd.append("name",this.name);
                this.fileList.forEach(item=>{
                    //文件信息中raw才是真的文件
                    fd.append("files",item.raw);
                    //console.log(item.raw)
                })

                setImg(fd).then(res=>{
                    if (res.data.status === 200) {
                     //  Message.success("上传成功")

                    }else{
                        Message.error("上传失败")
                    }
                })
            },
        }
    }
</script>
